var swiper = new Swiper('.swiper-container', {
        pagination: '.swiper-pagination',
        paginationClickable: true,
        direction: 'vertical',
         loop:true
    });
    $('.li1Child').hide();
    var arr = ['ad4.png','b.png','c.png','d.png','e.png','ad1.png','ad2.png','ad3.png','ad4.png','b.png'];
    var all=$('.swiper-slide>div');
    var iNow = 0;
    var $loading = $('#l_d');

		
		for(var i=0;i<arr.length;i++){
			var objImg = new Image();
			objImg.src = 'img/'+arr[i];
			all.eq(i).css({'background':'url('+objImg.src+') no-repeat'});
			all.eq(i).css({'backgroundSize':'100% 100%'});
			objImg.onload = function(){
				iNow++;
				if(iNow == arr.length){
					$loading.animate({opacity:0},1000,function(){
						$(this).remove();
					});
				}
			};
			objImg.onerror = function(){
				$loading.animate({opacity:0},1000,function(){
					$(this).remove();
				});
			};
		}
		var cliw=$(window).width();
		var clih=$(window).height();
		$('#c1').attr('width',cliw);
		$('#c1').attr('height',clih);
		var canvas = document.getElementById("c1");
		var context = canvas.getContext("2d");

		var img = new Image();
		img.src = "img/a.png";
		img.onload = function(){
//			 context.fillStyle = 'red';
			context.drawImage(img,0,0,cliw,clih);
//			var c = context.getImageData(0,0,640,960);
//			var len = c.data.length;
//		    for(i=0;i<len;i+=4){
//		    	var r = c.data[i];
//		    	var g = c.data[i+1];
//		    	var b = c.data[i+2];
//		    	c.data[i] = c.data[i+1] = c.data[i+2] = (r+g+b)/3;           
//		    }
		   
	context.globalCompositeOperation="destination-out";
    context.lineWidth=50;
    context.lineCap="round";//两头圆
    context.lineJoin="round";//拐角圆
    $('#c1').on('touchstart',function(ev){
    	
        var e=ev.originalEvent.changedTouches[0];
        var x=e.clientX-canvas.offsetLeft;
         var y=e.clientY-canvas.offsetTop;
        context.moveTo(x,y);
        $('#c1').on('touchmove.aaa',function(ev){
        	var e=ev.originalEvent.changedTouches[0];
            var x=e.clientX-canvas.offsetLeft;
         	var y=e.clientY-canvas.offsetTop;
         	ev.originalEvent.preventDefault();
            context.lineTo(x,y);
            
            context.stroke();
        })
        $('#c1').on('touchend.aaa',function(){
             $('#c1').off('.aaa');
            //执行完后移除下onmouseup，当鼠标按下又生成onmouseup事件
            judge();
        })
    })
    function judge(){
        var data=context.getImageData(0,0,cliw,clih).data;
//       console.log(data)
        var len =data.length;
        var cnt=0;
        for(var i=3;i<len;i+=4) {
				if(data[i] == 0) {
					cnt++;
				}
			}
//     console.log(cnt)
        if(cnt/(len/4)>0.2){
        	$('#c1').animate({opacity:0},1000,'linear',function(){
        		context.clearRect(0,0,cliw,clih);
            $('#c1').hide();
            showMusic();
            $('.li1Child').show();
        	})
            
        }
        
    }
		}


		function showMusic(){
		var $music = $('#music');
		var $audio1 = $('#audio1');
		var onoff = true;
		$music.on('touchstart',function(){
			if(onoff){
				$(this).attr('class','active');
				$audio1.get(0).play();
			}
			else{
				$(this).attr('class','');
				$audio1.get(0).pause();
			}
			onoff = !onoff;
		});
		$music.trigger('touchstart');
		
	}